<template>
  <el-input v-model="currentValue" :size="size" :placeholder="placeholder" class="w-fill"/>
</template>
<script setup name="FlowInput">

import {
  reactive,
  ref,
  createApp,
  
  computed,
  onMounted,
  toRefs,
  defineExpose,
  getCurrentInstance,
  watch
} from "vue";
import {useStore} from 'vuex';
/* 组件局部注册 */
const store = useStore();
const emit = defineEmits(['input', 'update:name'])


const props = defineProps({
  size: {
    type: String,
    required: false,
    default: 'large',
  },
  value: {
    type: Array,
    required: false,
    default: () => [],
  },
  placeholder: {
    type: String,
    required: false,
    default: '数值',
  }
})

const {value} = toRefs(props)

const currentValue = ref(null);


const initData = (value) => {
  if (value && value.length > 0) {
    currentValue.value = value[0];
  } else {
    currentValue.value = null;
  }
}
const onChange = (value) => {
  emit('input', [value]);
  emit('update:name', [value]);
}


watch(value, (newValue, oldValue) => {
  initData(newValue);
}, {immediate: true})


watch(currentValue, (newValue, oldValue) => {
  initData(newValue);
}, {immediate: true})

computed(() => {
  initData(value);
})
</script>
